<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link type="text/css" rel="stylesheet" href="css/login.css"/>
    <title>忘记密码-确认账户</title>
</head>
<body>
<div class="header">
    <div class="mainwarp">
        <div class="logo"><a href="../../../../target/classes/public/index.html"><img src="images/log.png"/></a></div>
        <div class="welcome">重置密码</div>
        <div class="headerright">
            <a href="login.html">个人登录 </a>
            <span>|</span>
            <a href="../../../../target/classes/public/index.html">返回首页</a>
        </div>
    </div>
</div>
<div class="passdBox">
    <div class="passpart1">
        <div class="TitleNotice">忘记密码了？根据收到的激活码进行验证身份，通过验证后重置密码，您就可以登录了。</div>
        <div class="StepsBox">
            <div id="step_div_1" class="Step Active stepfirst">
                <span class="StepNo">1</span>
                <span class="StepName">确认账户</span>
            </div>
            <div id="step_div_2" class="Step">
                <span class="StepNo">2</span>
                <span class="StepName">安全认证</span>
            </div>
            <div id="step_div_3" class="Step">
                <span class="StepNo">3</span>
                <span class="StepName">重置密码</span>
            </div>
            <div id="step_div_4" class="Step steplast">
                <span class="StepNo"></span>
                <span class="StepName">完成</span>
            </div>
        </div>
        <div class="clear"></div>
        <div id="step_1" class="restInfo">
            <div class="box1">
                <span>账   户：</span>
                <input id="phone" type="text" placeholder="用户名/邮箱/已验证手机号"/>
                <div class="clear"></div>
            </div>
            <div class="box1">
                <span>验证码：</span>
                <input id="yanzheng" type="text" class="yzm"/>
                <img src="images/VerifyCode.jpg" width="100" height="35"/>
                <div class="clear"></div>
            </div>
            <div class="box1">
                <input name="1" type="button" step_index="1" class="onebtn" value="下一步"/>
            </div>
        </div>
        <div id="step_2" class="restInfo" hidden>
            <div class="box2">激活码已经发送到您的手机：152*******56 中</div>
            <div class="box1">
                <span>激活码：</span>
                <input name="" type="text" class="yzm"/>
                <b class="phonenum">获取短信验证码</b>
                <div class="clear"></div>
            </div>
            <div class="box1">
                <input name="2" id="2" type="button" step_index="2" class="onebtn" value="下一步"/>
            </div>
        </div>
        <div id="step_3" class="restInfo" hidden>
            <div class="box2">
                <div class="clear"></div>
            </div>
            <div class="box1">
                <span>新密码：</span>
                <input id="pd" type="text"/>
                <div class="clear"></div>
            </div>
            <div class="box1">
                <span>确认密码：</span>
                <input id="cpd" type="text"/>
                <div class="clear"></div>3
            </div>
            <div class="box1">
                <input name="3" id="3" type="button" step_index="3" class="onebtn" value="下一步"/>
            </div>
        </div>
        <div id="step_4" class="restInfo2" hidden>
            <div class="SucTitle">恭喜您，您的密码设置成功！</div>
            <p id="num"></p>
            <p>您可以使用新密码登录蝶飞人才网<a href="login.html">立即登录</a></p>
        </div>

    </div>
</div>
<div class="clear"></div>
</body>
<script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
<script>
    $(function () {
        $(".onebtn").on("click", function () {
            let  phone=$("#phone").val();
            $("#num").val("你的用户名是："+phone);
            let stepIndex = $(this).attr("step_index");
            let stepId = '#step_' + stepIndex;
            stepIndex++;
            let divNextId = '#step_div_' + stepIndex;
            let stepNextId = '#step_' + stepIndex;
            //在修改密码前先查询该用户是否存在
            $.get("user/selectUser",{"phone":phone},function (mess) {
                if (mess){
                    $(stepId).hide();
                    $(stepNextId).show();
                    $(divNextId).addClass("Active");

                }else {
                    alert("用户不存在，请重新输入");
                }

        });


    });
        $("#3").click(function () {
            let  phone=$("#phone").val();
            let stepIndex = $(this).attr("step_index");
            let stepId = '#step_' + stepIndex;
            stepIndex++;
            let divNextId = '#step_div_' + stepIndex;
            let stepNextId = '#step_' + stepIndex;
            let password=$("#pd").val();
            let cpd=$("#cpd").val();
            if (password===cpd)
            {   //若用户存在修改密码
                $.get("user/updatePassword",{"password":password,"phone":phone},function (mess) {
                    if (mess){
                        $(stepId).hide();
                        $(stepNextId).show();
                        $(divNextId).addClass("Active");
                    }else {
                        alert("修改失败账户不存在");
                    }
                });
            }
            else {alert("两次输入密码不一致")}

        })
    });

</script>
</html>
